<script>
export default {
    name:"Layout",
}
</script>

<template>
    <div>
        <ul class="top-nav">
            <li>
                <img src="../assets/sucai/素材/xuexiao2.png" alt="">
            </li>
            <li>
                <router-link exact to="/">首页</router-link> 
            </li>
            <li>
                <router-link to="/home">院部简介</router-link>
            </li>
            <li>
                <router-link to="/about">办学特色</router-link>
            </li>
            <li>
                <router-link to="/home">专业介绍</router-link>
            </li>
            <li>
                <router-link to="/about">领导关怀</router-link>
            </li>
            <li>
                <router-link to="/home">对外交流</router-link>
            </li>
            <li>
                <router-link to="/about">社会服务</router-link>
            </li>
            <li>
                <router-link to="/home">师资力量</router-link>
            </li>
            <li>
                <router-link to="/about">实训中心</router-link>
            </li>
            <li>
                <router-link to="/about">实习基地</router-link>
            </li>
        </ul>

        <router-view/>
    </div>
</template>
<style scoped lang="scss">
.top-nav {
    display: flex;
    background: #690102;
    border: 1px solid #000;
    li {
        list-style: none;
        flex: 1;
        text-align: center;
        padding-top: 10px;
        a {
            text-decoration: none;
            display: block;
            padding-bottom: 8px;
            color: #fff;
        }
        .active {
            border-bottom: 2px solid #ff0000;
        }
    }
}
</style>

